<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--部门数据-->
      <el-col :span="4" :xs="24">
        <div class="head-container">
          <el-input
            v-model="deptName"
            placeholder="请输入公司名称"
            clearable
            size="small"
            prefix-icon="el-icon-search"
            style="margin-bottom: 20px"
            @input="filterNode"
          />
        </div>
        <div class="head-container">
          <!-- <el-tree
            :data="deptOptions"
            :props="defaultProps"
            :expand-on-click-node="false"
            :filter-node-method="filterNode"
            ref="tree"
            node-key="id"
            default-expand-all
            highlight-current
            @node-click="handleNodeClick"
          /> -->
          <el-menu
            default-active="911401000054xxxx1"
            class="el-menu-vertical-demo"
            @select="handleNodeClick"
          >
            <el-menu-item
              :index="item.companyCode"
              v-for="(item, index) of deptOptions"
              :key="index"
            >
              {{ item.companyName }}
            </el-menu-item>
          </el-menu>
        </div>
      </el-col>
      <!--用户数据-->
      <el-col :span="20" :xs="24">
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="68px"
        >
          <!-- <el-form-item label="用户名称" prop="userName">
              <el-input
                v-model="queryParams.userName"
                placeholder="请输入用户名称"
                clearable
                style="width: 240px"
                @keyup.enter.native="handleQuery"
              />
            </el-form-item>
            <el-form-item label="手机号码" prop="phonenumber">
              <el-input
                v-model="queryParams.phonenumber"
                placeholder="请输入手机号码"
                clearable
                style="width: 240px"
                @keyup.enter.native="handleQuery"
              />
            </el-form-item>
            <el-form-item label="状态" prop="status">
              <el-select
                v-model="queryParams.status"
                placeholder="用户状态"
                clearable
                style="width: 240px"
              >
                <el-option
                  v-for="dict in dict.type.sys_normal_disable"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="创建时间">
              <el-date-picker
                v-model="dateRange"
                style="width: 240px"
                value-format="yyyy-MM-dd"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              ></el-date-picker>
            </el-form-item> -->
          <el-form-item label="配额方式" prop="quotaMethods">
            <el-select
              v-model="queryParams.quotaMethods"
              placeholder="选择配额方式"
              clearable
              style="width: 240px"
            >
              <el-option
                v-for="dict in quotaMethods"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
              />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="mini"
              @click="handleQuery"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
              >重置</el-button
            >
          </el-form-item>
        </el-form>

        <!-- <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
                v-hasPermi="['system:user:add']"
              >新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="success"
                plain
                icon="el-icon-edit"
                size="mini"
                :disabled="single"
                @click="handleUpdate"
                v-hasPermi="['system:user:edit']"
              >修改</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="multiple"
                @click="handleDelete"
                v-hasPermi="['system:user:remove']"
              >删除</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="info"
                plain
                icon="el-icon-upload2"
                size="mini"
                @click="handleImport"
                v-hasPermi="['system:user:import']"
              >导入</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="warning"
                plain
                icon="el-icon-download"
                size="mini"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
              >导出</el-button>
            </el-col>
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
          </el-row> -->

        <el-table v-loading="loading" :data="userList">
          <!-- <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange"> -->
          <!-- <el-table-column type="selection" width="50" align="center" /> -->
          <el-table-column
            label="企业名称"
            align="center"
            key="companyName"
            prop="companyName"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="1月配额"
            align="center"
            key="oneQuota"
            prop="oneQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="2月配额"
            align="center"
            key="twoQuota"
            prop="twoQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="3月配额"
            align="center"
            key="threeQuota"
            prop="threeQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="4月配额"
            align="center"
            key="fourQuota"
            prop="fourQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="5月配额"
            align="center"
            key="fiveQuota"
            prop="fiveQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="6月配额"
            align="center"
            key="sixQuota"
            prop="sixQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="7月配额"
            align="center"
            key="sevenQuota"
            prop="sevenQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="8月配额"
            align="center"
            key="eightQuota"
            prop="eightQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="9月配额"
            align="center"
            key="nineQuota"
            prop="nineQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="10月配额"
            align="center"
            key="tenQuota"
            prop="tenQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="11月配额"
            align="center"
            key="elevenQuota"
            prop="elevenQuota"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="12月配额"
            align="center"
            key="twelveQuota"
            prop="twelveQuota"
            :show-overflow-tooltip="true"
          />
          <!-- <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
            <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
            <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
            <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
              <template slot-scope="scope">
                <el-switch
                  v-model="scope.row.status"
                  active-value="0"
                  inactive-value="1"
                  @change="handleStatusChange(scope.row)"
                ></el-switch>
              </template>
            </el-table-column>
            <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime) }}</span>
              </template>
            </el-table-column> -->
          <el-table-column
            label="操作"
            align="center"
            width="160"
            fixed="right"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                icon="el-icon-position"
                @click="handleQuota(scope.row)"
                >分配配额</el-button
              >
            </template>
            <!-- <template slot-scope="scope" v-if="scope.row.userId !== 1">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleUpdate(scope.row)"
                  v-hasPermi="['system:user:edit']"
                >修改</el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDelete(scope.row)"
                  v-hasPermi="['system:user:remove']"
                >删除</el-button>
                <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']">
                  <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="handleResetPwd" icon="el-icon-key"
                      v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
                    <el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check"
                      v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </template> -->
          </el-table-column>
        </el-table>

        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />
      </el-col>
    </el-row>

    <!-- 添加或修改用户配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="企业名称" prop="companyName">
          <el-input
            disabled
            v-model="form.companyName"
            placeholder="请输入企业名称"
          />
        </el-form-item>
        <el-form-item label="月份" prop="month">
          <el-select
            v-model="form.month"
            placeholder="请选择月份"
            style="width: 100%"
          >
            <el-option
              v-for="dict in months"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="配额" prop="quota">
          <el-input v-model="form.quota" placeholder="请输入配额" />
        </el-form-item>
        <!-- <el-row>
            <el-col :span="12">
              <el-form-item label="用户昵称" prop="nickName">
                <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="归属部门" prop="deptId">
                <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="手机号码" prop="phonenumber">
                <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="邮箱" prop="email">
                <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
                <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
                <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="用户性别">
                <el-select v-model="form.sex" placeholder="请选择性别">
                  <el-option
                    v-for="dict in dict.type.sys_user_sex"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="状态">
                <el-radio-group v-model="form.status">
                  <el-radio
                    v-for="dict in dict.type.sys_normal_disable"
                    :key="dict.value"
                    :label="dict.value"
                  >{{dict.label}}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="岗位">
                <el-select v-model="form.postIds" multiple placeholder="请选择岗位">
                  <el-option
                    v-for="item in postOptions"
                    :key="item.postId"
                    :label="item.postName"
                    :value="item.postId"
                    :disabled="item.status == 1"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="角色">
                <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
                  <el-option
                    v-for="item in roleOptions"
                    :key="item.roleId"
                    :label="item.roleName"
                    :value="item.roleId"
                    :disabled="item.status == 1"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="备注">
                <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
              </el-form-item>
            </el-col>
          </el-row> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 用户导入对话框 -->
    <!-- <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
        <el-upload
          ref="upload"
          :limit="1"
          accept=".xlsx, .xls"
          :headers="upload.headers"
          :action="upload.url + '?updateSupport=' + upload.updateSupport"
          :disabled="upload.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="false"
          drag
        >
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
          <div class="el-upload__tip text-center" slot="tip">
            <div class="el-upload__tip" slot="tip">
              <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
            </div>
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>
          </div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFileForm">确 定</el-button>
          <el-button @click="upload.open = false">取 消</el-button>
        </div>
      </el-dialog> -->
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
  deptTreeSelect,
} from "@/api/system/user";
import {
  listLog,listCompany,listAllocation
} from "@/api/demoApi/index";
import { getToken } from "@/utils/auth";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  name: "User",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      // 配额方式
      quotaMethods: [],
      // 月份
      months: [
        {
          value: "1",
          label: "1月",
        },
        {
          value: "2",
          label: "2月",
        },
        {
          value: "3",
          label: "3月",
        },
        {
          value: "4",
          label: "4月",
        },
        {
          value: "5",
          label: "5月",
        },
        {
          value: "6",
          label: "6月",
        },
        {
          value: "7",
          label: "7月",
        },
        {
          value: "8",
          label: "8月",
        },
        {
          value: "9",
          label: "9月",
        },
        {
          value: "10",
          label: "10月",
        },
        {
          value: "11",
          label: "11月",
        },
        {
          value: "12",
          label: "12月",
        },
      ],
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 用户表格数据 / 配额表格数据
      userList: null,
      // 弹出层标题
      title: "",
      // 部门树选项
      deptOptions: undefined,
      // 是否显示弹出层
      open: false,
      // 部门名称
      deptName: undefined,
    //   // 默认密码
    //   initPassword: undefined,
      // 日期范围
      dateRange: [],
    //   // 岗位选项
    //   postOptions: [],
    //   // 角色选项
    //   roleOptions: [],
      // 表单参数
      form: {},
      defaultProps: {
        children: "children",
        label: "companyName",
      },
    //   // 用户导入参数
    //   upload: {
    //     // 是否显示弹出层（用户导入）
    //     open: false,
    //     // 弹出层标题（用户导入）
    //     title: "",
    //     // 是否禁用上传
    //     isUploading: false,
    //     // 是否更新已经存在的用户数据
    //     updateSupport: 0,
    //     // 设置上传的请求头部
    //     headers: { Authorization: "Bearer " + getToken() },
    //     // 上传的地址
    //     url: process.env.VUE_APP_BASE_API + "/system/user/importData",
    //   },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        phonenumber: undefined,
        status: undefined,
        deptId: undefined,
        quotaMethods: "2",
      },
      //   // 列信息
      //   columns: [
      //     { key: 0, label: `用户编号`, visible: true },
      //     { key: 1, label: `用户名称`, visible: true },
      //     { key: 2, label: `用户昵称`, visible: true },
      //     { key: 3, label: `部门`, visible: true },
      //     { key: 4, label: `手机号码`, visible: true },
      //     { key: 5, label: `状态`, visible: true },
      //     { key: 6, label: `创建时间`, visible: true },
      //   ],
      // 表单校验
      rules: {
        //   userName: [
        //     { required: true, message: "用户名称不能为空", trigger: "blur" },
        //     { min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur' }
        //   ],
        //   nickName: [
        //     { required: true, message: "用户昵称不能为空", trigger: "blur" }
        //   ],
        //   password: [
        //     { required: true, message: "用户密码不能为空", trigger: "blur" },
        //     { min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
        //   ],
        //   email: [
        //     {
        //       type: "email",
        //       message: "请输入正确的邮箱地址",
        //       trigger: ["blur", "change"]
        //     }
        //   ],
        //   phonenumber: [
        //     {
        //       pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
        //       message: "请输入正确的手机号码",
        //       trigger: "blur"
        //     }
        //   ]
        month: [
          {
            required: true,
            message: "月份不能为空",
            trigger: ["blur", "change"],
          },
        ],
        quota: [
          {
            required: true,
            message: "配额不能为空",
            trigger: ["blur", "change"],
          },
        ],
      },
    };
  },
  watch: {
    // // 根据名称筛选部门树
    // deptName(val) {
    //   this.$refs.tree.filter(val);
    // },
  },
  created() {
    this.getList();
    this.getDeptTree();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
    this.getDicts("quota_method").then((response) => {
    //   console.log(response.data);
      this.quotaMethods = response.data;
    });
  },
  methods: {
    // 解析配额方式字典
    quotaMethodsFormat(row, column) {
      return this.selectDictLabel(this.quotaMethods, row.quotaType);
    },
    // 分配配额
    handleQuota(row) {
      this.open = true;
      this.form.companyName = row.companyName;
      this.title = "分配配额";
    },
    /** 查询用户列表 */
    getList() {
      this.loading = true;
      listAllocation(this.addDateRange(this.queryParams)).then(
        (response) => {
          this.userList = response.rows;
          this.total = 10;
          this.loading = false;
        }
      );
    },
    /** 查询部门下拉树结构 */
    getDeptTree() {
      listCompany().then(res=> {
        this.deptOptions = res.rows;
      })
      // deptTreeSelect().then((response) => {
      //   this.deptOptions = response.data;
      // });
    },
    // 筛选节点
    filterNode(value, data) {
      // if (!value) return true;
      // // return data.label.indexOf(value) !== -1;
      // return data.companyName.indexOf(value) !== -1;

      if(value.length>0) {
        let subDeptOption = [];
      subDeptOption = this.deptOptions.filter(
        (item) => item.companyName.indexOf(value) != -1
      );
      if(subDeptOption.length>0){
        this.deptOptions = subDeptOption;
      }
      } else {
        this.getDeptTree()
      }
    },
    // 节点单击事件
    handleNodeClick(data) {
      // this.queryParams.deptId = data.id;
      this.queryParams.deptId = data;
      this.handleQuery();
    },
    // // 用户状态修改
    // handleStatusChange(row) {
    //   let text = row.status === "0" ? "启用" : "停用";
    //   this.$modal
    //     .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
    //     .then(function () {
    //       return changeUserStatus(row.userId, row.status);
    //     })
    //     .then(() => {
    //       this.$modal.msgSuccess(text + "成功");
    //     })
    //     .catch(function () {
    //       row.status = row.status === "0" ? "1" : "0";
    //     });
    // },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],

        companyName: "",
        month: "",
        quota: undefined,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // 多选框选中数据
    // handleSelectionChange(selection) {
    //   this.ids = selection.map((item) => item.userId);
    //   this.single = selection.length != 1;
    //   this.multiple = !selection.length;
    // },
    // 更多操作触发
    // handleCommand(command, row) {
    //   switch (command) {
    //     case "handleResetPwd":
    //       this.handleResetPwd(row);
    //       break;
    //     case "handleAuthRole":
    //       this.handleAuthRole(row);
    //       break;
    //     default:
    //       break;
    //   }
    // },
    /** 新增按钮操作 */
    // handleAdd() {
    //   this.reset();
    //   getUser().then((response) => {
    //     this.postOptions = response.posts;
    //     this.roleOptions = response.roles;
    //     this.open = true;
    //     this.title = "添加用户";
    //     this.form.password = this.initPassword;
    //   });
    // },
    /** 修改按钮操作 */
    // handleUpdate(row) {
    //   this.reset();
    //   const userId = row.userId || this.ids;
    //   getUser(userId).then((response) => {
    //     this.form = response.data;
    //     this.postOptions = response.posts;
    //     this.roleOptions = response.roles;
    //     this.$set(this.form, "postIds", response.postIds);
    //     this.$set(this.form, "roleIds", response.roleIds);
        // this.open = true;
        // this.title = "修改用户";
    //     this.form.password = "";
    //   });
    // },
    /** 重置密码按钮操作 */
    // handleResetPwd(row) {
    //   this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
    //     confirmButtonText: "确定",
    //     cancelButtonText: "取消",
    //     closeOnClickModal: false,
    //     inputPattern: /^.{5,20}$/,
    //     inputErrorMessage: "用户密码长度必须介于 5 和 20 之间",
    //   })
    //     .then(({ value }) => {
    //       resetUserPwd(row.userId, value).then((response) => {
    //         this.$modal.msgSuccess("修改成功，新密码是：" + value);
    //       });
    //     })
    //     .catch(() => {});
    // },
    // /** 分配角色操作 */
    // handleAuthRole: function (row) {
    //   const userId = row.userId;
    //   this.$router.push("/system/user-auth/role/" + userId);
    // },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    // /** 删除按钮操作 */
    // handleDelete(row) {
    //   const userIds = row.userId || this.ids;
    //   this.$modal
    //     .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
    //     .then(function () {
    //       return delUser(userIds);
    //     })
    //     .then(() => {
    //       this.getList();
    //       this.$modal.msgSuccess("删除成功");
    //     })
    //     .catch(() => {});
    // },
    // /** 导出按钮操作 */
    // handleExport() {
    //   this.download(
    //     "system/user/export",
    //     {
    //       ...this.queryParams,
    //     },
    //     `user_${new Date().getTime()}.xlsx`
    //   );
    // },
    // /** 导入按钮操作 */
    // handleImport() {
    //   this.upload.title = "用户导入";
    //   this.upload.open = true;
    // },
    // /** 下载模板操作 */
    // importTemplate() {
    //   this.download(
    //     "system/user/importTemplate",
    //     {},
    //     `user_template_${new Date().getTime()}.xlsx`
    //   );
    // },
    // 文件上传中处理
    // handleFileUploadProgress(event, file, fileList) {
    //   this.upload.isUploading = true;
    // },
    // // 文件上传成功处理
    // handleFileSuccess(response, file, fileList) {
    //   this.upload.open = false;
    //   this.upload.isUploading = false;
    //   this.$refs.upload.clearFiles();
    //   this.$alert(
    //     "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
    //       response.msg +
    //       "</div>",
    //     "导入结果",
    //     { dangerouslyUseHTMLString: true }
    //   );
    //   this.getList();
    // },
    // // 提交上传文件
    // submitFileForm() {
    //   this.$refs.upload.submit();
    // },
  },
};
</script>
